// 导入get方法
import { get } from "../js/api.js";
// 获取商品分类信息并渲染到页面上
get("/goods/category").then((res) => {
   // 移除第一个子元素
  $(".category").children("li:not(:first)").remove();
  // 遍历商品分类列表，将每个分类添加到页面上
  $.each(res.data.list, function (index, category) {
    if (index > 0) {
      $("<li>").text(category).appendTo(".category");
    }
  });
});
// 调用getlist方法获取商品列表
getlist();
// 监听搜索框输入事件，根据输入内容筛选商品列表
$(".search").on("input", function () {
  getlist("", this.value, "", "", "", "", "");
});
// 点击分类时，切换选中状态并重新获取商品列表
$(".category").click(function (e) {
  if (e.target == e.currentTarget) {
    return;
  }
  let chid = $(this).children();
  for (let i = 0; i < chid.length; i++) {
    $(chid[i]).removeClass("active");
  }
  $(e.target).addClass("active");
  getlist("", $(e.target).text(), "", "", "", "", "");
});
// 点击筛选条件时，切换选中状态并重新获取商品列表
$(".chose").click(function (e) {
  if (e.target == e.currentTarget) {
    return;
  }
  let chid = $(this).children();
  for (let i = 0; i < chid.length; i++) {
    $(chid[i]).removeClass("active");
  }
  $(e.target).addClass("active");
  getlist("", "", e.target.getAttribute("data-type"), "", "", "", "");
});
// 点击销售类型时，切换选中状态并重新获取商品列表
$(".saleBox").click(function (e) {
  if (e.target == e.currentTarget) {
    return;
  }
  let chid = $(this).children();
  for (let i = 0; i < chid.length; i++) {
    $(chid[i]).removeClass("active");
  }
  $(e.target).addClass("active");
  getlist("", "", "", e.target.getAttribute("data-type"), "", "", "");
});
// 点击排序方式时，切换选中状态并重新获取商品列表
$(".sortBox").click(function (e) {
  if (e.target == e.currentTarget) {
    return;
  }
  let chid = $(this).children();
  for (let i = 0; i < chid.length; i++) {
    $(chid[i]).removeClass("active");
  }
  $(e.target).addClass("active");
  getlist(
    "",
    "",
    "",
    "",
    e.target.getAttribute("data-type"),
    e.target.getAttribute("data-method"),
    ""
  );
});
// 根据传入的参数获取商品列表
function getlist(
  pagesize,
  search,
  filter,
  saleType,
  sortType,
  sortMethod,
  category
) {
  // 构造请求参数
  let formData = {
    pagesize: pagesize || 10000000,
    search: search || "",
    filter: filter || "",
    saleType: saleType || 10,
    sortType: sortType || "id",
    sortMethod: sortMethod || "ASC",
    category: category || "",
  };
  // 发送请求获取商品列表数据
  get("/goods/list", formData).then((res) => {
    let { list } = res.data;
     // 如果商品列表为空，显示暂无商品图片
    if (!list.length) {
      $(".list").empty();
      var $li = $("<li>");
      var $img = $("<img>").attr("src", "../img/nothing.jpg");
      $li.append($img);
      $(".list").append($li);
      return;
    }
    // 使用layui分页插件渲染分页和商品列表
    layui.use(["laypage", "jquery"], function () {
      var laypage = layui.laypage,
        $ = layui.jquery;
      //执行一个laypage实例
      laypage.render({
        elem: "pagination",
        limit: 8,
        count: list.length,
        jump: function (obj, first) {
          var currentData = list.slice(
            (obj.curr - 1) * obj.limit,
            obj.curr * obj.limit
          );
          $(".list").empty();
          $.each(currentData, function (index, product) {
            var $li = $("<li>")
              .attr("data-id", product.goods_id)
              .click(function () {
                window.location.href = "detail.html?id=" + product.goods_id;
              });
            var $show = $("<div>").addClass("show");
            var $img = $("<img>").attr("src", product.img_big_logo);
            var $hot = $("<span>")
              .addClass("hot")
              .text(product.is_hot ? "热销" : "");
            var $discount = $("<span>").text(product.is_sale ? "折扣" : "");

            $show.append($img, $hot, $discount);
            $li.append($show);

            var $info = $("<div>").addClass("info");
            var $title = $("<p>").addClass("title").text(product.title);
            var $price = $("<p>").addClass("price");
            var $curr = $("<span>")
              .addClass("curr")
              .text(product.current_price);
            var $old = $("<span>").addClass("old").text(product.price);

            $price.append($curr, $old);
            $info.append($title, $price);
            $li.append($info);
            $(".list").append($li);
          });
        },
      });
    });
  });
}
